<template>
  <div class="tw-libpdf">
    <iframe :src="generatePdfUrl(pdfUrl.url)"></iframe>
  </div>
</template>

<script>
import props from './props'
import style from '../tw-lib-base/style'

export default {
  name: 'lib-viewer',

  mixins: [style],

  props,

  computed: {
    style () {
      return {
        pdfWidth: this.pdfWidth,
        pdfHeight: this.pdfHeight
      }
    }
  },

  methods: {
    generatePdfUrl (url) {
      return `./lib/pdfjs/web/viewer.html?file=${encodeURI(url)}`
    },

    setStyle () {
      let style = ''

      if (this.pdfWidth) {
        style += `
          ::root.tw-libpdf iframe {
            width: ${this.pdfWidth};
          }
        `
      }

      if (this.pdfHeight) {
        style += `
          ::root.tw-libpdf iframe {
            height: ${this.pdfHeight};
          }
        `
      }

      this.addStyle(style)
    }
  }
}
</script>

<style lang="scss">
  @import './css/index.scss';
</style>
